html,body,.section,.content,.listbg{
    width:100%;
	height:100%;	
}
html,body,.content{
    overflow:hidden;
}
/* 内容 */
.section{
    position:absolute;
	top:0;
	left:0;
	transition:top 0.5s;
	-webkit-transition:top 0.5s;
	-moz-transition:top 0.5s;
	-o-transition:top 0.5s;
}
.scale{
    zoom: .65;
	height: 950px;
	z-index: 1;
	-moz-transform: scale(0.65);
	-moz-transform-origin: center 0
}
.content{
	position:relative;
	text-align:center;
}
#page3 .txt1,#page3 .txt2,#page3 .txt3,#page3 .txt4,.content2 .people
,.txt_l,.txt_r,.mobile,.txt1,.mobile_scroll,#page2 .txt2,.four_txt,#page5 .txt3
,#page5 .txt2,#page5 .mv,#page3 .video2,.manlist,.tatter,.triangle,.btn_play,.video{
    position:absolute;
	top:50%;
	left:50%;
	transform-style:preserve-3d;
}
/* 首页 */
#page1{
    background:#4372d9;
}
.listbg{
    position:absolute;
	top:0;
	left:0;
	opacity:0.1;
	filter:alpha(opacity=10);
}
.listbg li{
    float:left;
	background-position:center top;
	background-size:cover;
}
.enter{
    position:absolute;
	top:40px;
	left:75px;
	width:180px;
	height:42px;
	font-size:16px;	
	line-height:42px;
	text-align:center;	
	opacity:1;
	color:#fff;
	border:2px #fff solid;
	cursor:pointer;
	transform-style:preserve-3d;
	transition:all 0.5s ease 0.4s;
}
.enter:hover{
    opacity:0.6;
}
.content1 .enter{
    top:-20px;
	opacity:0;
}
.arrow{
    display:inline-block;
	width:16px;
	height:16px;
	margin-right:8px;	
	vertical-align: middle;
	background:url(../img/back_arrow.png)0 -10px no-repeat;
}
.line_t_l{
    position:absolute;
	top:-15px;
	left:50%;
	width:168px;
	height:335px;
	margin-left:-322px;
	background:url(../img/line_t_l.png);
	transform-style:preserve-3d;
	transition:all 0.6s ease;
}
.content1 .line_t_l{
   margin:-282px 0 0 -128px;
   opacity:0;
}
.line_t_r{
    position:absolute;
	top:0;
	left:50%;
	width:407px;
	height:432px;
	margin-left:182px;
	background:url(../img/line_t_r.png);
	transform-style:preserve-3d;
	transition:all 0.6s ease;
}
.content1 .line_t_r{
    margin:-432px 0 0 407px;
	opacity:0;
}
.content2 .people{    
	width:763px;
	height:728px;
	margin:-421px 0 0 -393px;
	background:url(../img/people.png);
	transition:all 0.5s ease;
	animation:ani_people 0.4s ease 1 both;
}
@keyframes ani_people{
    0%{
	   margin:-531px 0 0 -393px;
	   opacity:0;
	}
	100%{
	    margin:-431px 0 0 -393px;
		opacity:1;
	}
}
.content1 .people{
    margin:-521px 0 0 -393px;
	opacity:1;
}
.line_t_r2{
    position:absolute;
	top:110px;
	left:50%;
	width:138px;
	height:206px;
	margin-left:237px;
	background:url(../img/line_t_r2.png);
	transform-style:preserve-3d;
	transition:all 0.5s ease;
}
.content1 .line_t_r2{
    margin:-316px 0 0 395px;
	opacity:0;
}
.line_b_l{
    position:absolute;
	top:110px;
	left:50%;
	width:171px;
	height:174px;
	margin:420px 0 0 -356px;
	background:url(../img/line_b_l.png);
	transform-style:preserve-3d;
	transition:all 0.8s ease;
}
.content1 .line_b_l{
    margin:595px 0 0 -527px;
	opacity:0;
}
.line_b_r{
    position:absolute;
	top:110px;
	left:50%;
	width:362px;
	height:320px;
	margin:450px 0 0 -56px;
	background:url(../img/line_b_r.png);
	opacity:0.8;
	transform-style:preserve-3d;
	transition:all 0.8s ease;
}
.content1 .line_b_r{
    margin:770px 0 0 -318px;
	opacity:0;
}
.txt_l{    
	width:387px;
	height:159px;
	margin:-87px 0 0 -534px;
	background:url(../img/txt_left.png);
	transition:all 0.5s ease;
}
.content1 .txt_l{
    margin-left:-630px;
	opacity:0;
}
.txt_r{
	width:408px;
	height:160px;
	margin:-77px 0 0 129px;
	background:url(../img/txt_right.png);
	transition:all 0.5s ease;
}
.content1 .txt_r{
    margin-left:229px;
	opacity:0;
}
.down_android,.down_ios{
    position:absolute;
	bottom:10%;
	left:50%;
	width:282px;
	height:62px;	
	cursor:pointer;
	transform-style:preserve-3d;
	transition:all 0.5s ease;
}
#page1 .down_android{
    margin-left:-380px;
	background:url(../img/btn_down.png)-1px -1px;
}
.content1 .down_android{
    bottom:5%;
	opacity:0;
}
#page1 .down_ios{
    margin-left:30px;
	background:url(../img/btn_down.png) -334px -1px;
}
.content1 .down_ios{
    bottom:5%;
	opacity:0;
}
.btn_twocode,.twocode{
    position:absolute;
	bottom:12%;
	left:50%;
}
.btn_twocode{    
	width:168px;
	height:30px;
	margin-left:350px;
	line-height:30px;
	font-size:16px;
	color:#fff;
	cursor:pointer;
}
.content1 .btn_twocode{
    left:55%;
	opacity:0;
}
.btn_twocode span{
    display:inline-block;
	width:24px;
	height:24px;
	margin-right:10px;
	background:url(../img/btn_down.png) -664px -20px;
	vertical-align:-6px;
}
.twocode{
	z-index:2;
	display:none;
	width:150px;
	height:150px;
	margin:0 0 36px 340px;
	background:#fff url(../img/twocode.png)no-repeat center ;
	border-radius:3px;
	box-shadow:0 2px 5px rgba(0,0,0,0.2);
}
/* 第二页 */
#page2{
    background:#e1e7ea url(../img/bg.jpg);
	background-size:cover;
}
#page2 .enter{
    color:#0ba0ee;
	border:2px solid #0ba0ee;
}
#page2 .arrow{
    background:url(../img/back_arrow.png)0 -40px no-repeat;
}
.logo,.mobile,.btn_twocode,#page3 .txt2,#page5 .txt1{
    transform-style:preserve-3d;
	transition:all 0.4s ease;
}
.logo{
    position:absolute;
	top:40px;
	left:50%;
	width:258px;
	height:34px;
	margin-left:-129px;
}
.content1 .logo{
    top:-20px;
	opacity:0;
}
.triangle{
	width:424px;
	height:627px;
	margin:-350px 0 0 -448px;
	background:url(../img/triangle.png);
	backface-visibility: hidden;
}
.content1 .triangle{
	opacity: 0;
}
.mobile{
	width:617px;
	height:614px;
	margin:-348px 0 0 -510px;
	background:url(../img/mobile.png);
}
.content1 .mobile{
    margin-top:-248px;
	opacity:0;
}
.mobile_scroll{    
	width:276px;
	height:240px;
	margin:-62px 0 0 -326px;
	overflow:hidden;
	transition:all 3s ease;
	opacity:1;
	background:url(../img/mobile_scroll.png) 0px -840px repeat-y;
}
.content1 .mobile_scroll{
    opacity:0;
	background:url(../img/mobile_scroll.png)0px 0px repeat-y;
}
#page2 .down_android{
    margin-left:-380px;
	background:url(../img/btn_down.png)-1px -94px;
}
#page2 .down_ios{
    margin-left:30px;
	background:url(../img/btn_down.png) -333px -93px;
}
#page2 .btn_twocode{
    color:#2d9eff;
}
#page2 .btn_twocode span{
    background:url(../img/btn_down.png) -664px -112px;
}
.txt1{
	width:410px;
	height:136px;
	margin:-290px 0 0 140px;
	transition:all 0.6s ease;
}
.content1 .txt1{
    margin-left:180px;
	opacity:0;
}
#page2 .txt2{
	width:188px;
	height:30px;
	margin:-158px 0 0 145px;
	line-height:30px;
	text-align:center;
	font-size:17px;
	letter-spacing:1px;
	color:#fff;
	background:#0ba0ee;
	transition:all 0.8s ease;
}
#page2.content1 .txt2{
    margin-left:230px;
	opacity:0;
}
.video{
	width:350px;
	height:255px;
	margin:-80px 0 0 146px;
	overflow:hidden;
	transition:all 1.2s ease;
}
.content1 .video{
    margin-left:250px;
	opacity:0;
}
.tab0,.tab1,.tab2{
	width:250px;
	height:30px;
}
.tab0{
	background:url(../img/tab_video.png) 0 0;
}
.tab1{
	background: url(../img/tab_video.png)0 -30px;
}
.tab0 li,.tab1 li,.tab2 li{
    float:left;
	width:123px;
	height:30px;
	cursor:pointer;
}
.list_video{
    width:700px;
	height:225px;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}
.list_video span{
    position:absolute;
	top:70px;
	left:130px;
	display:block;
	width:84px;
	height:93px;
	background:url(../img/btn_play.png);
	cursor:pointer;
}
.list_video li{
    position:relative;
    float:left;
	width:350px;
	height:225px;
	overflow:hidden;
}
.ucmask{
	position: absolute;
	top:0;
	left:0;
	z-index:3;
	background: #000000;
	opacity: 0.85;
}
.radius_box{
	display: none;
	width:680px;
	height:500px;
	position:absolute;
	z-index:4;
}
.radius_cont{
	padding:0 20px 20px;
	background: #2d2d2d;
	width:640px;
	height:409px;
}
.radius_title{
	line-height: 45px;
}
.radius_title h3{
	color: #ffffff;
	line-height:45px;
	font-size:16px;
	text-indent: 5px;
}
.radius_close{
	position: absolute;
	top:0px;
	right:-38px;
	background: url("../img/close_video.png") no-repeat;
	width:38px;
	height:39px;
	z-index:3;
	cursor: pointer;
}
/* 第三页 */
#page3{
   background:#000;
	z-index:0;
}
#page3 .txt2{    
	width:445px;
	height:28px;
	margin:0px 0 0 80px;
	font-size:26px;
	color:#fff;
	letter-spacing:1px;
	text-align:left;
}
#page3.content1 .txt2{
    margin-left:180px;
	opacity:0;
}
#page3 .txt3,#page3 .txt4{    
	height:37px;
	font-size:18px;
	color:#000;
	text-indent:8px;
	letter-spacing:1px;
	background:#fff;	
}
#page3 .txt3{
    width:275px;
	margin:60px 0 0 82px;
	transition:all 0.5s ease;
}
#page3 .txt4{
    width:318px;
	margin:110px 0 0 82px;
	transition:all 0.6s ease;
}
#page3.content1 .txt4{
    margin-left:260px;
	opacity:0;
}
#page3.content1 .txt3{
    margin-left:220px;
	opacity:0;
}
#page3 .txt1{    
	width:445px;
	height:170px;
	margin:-180px 0 0 70px;	
	transition:all 0.3s ease;
}
#page3.content1 .txt1{
    margin-left:140px;
	opacity:0;
}
.poster{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(../img/videobg.jpg) center center no-repeat;
	-webkit-background-size:cover;
	background-size: cover;
	opacity:0;
}
.btn_play{
	display: none;
	width:47px;
	height:52px;
	margin:-10px 0 0 311px;
	background: url(../img/btn_replay.png);
	cursor:pointer
}
#page3 .video2{
    width:510px;
	height:365px;
	margin:-215px 0 0 -480px;
	overflow:hidden;
	transition:all 0.6s ease;
}
#page3.content1 .video2{
    margin-left:-580px;
	opacity:0;
}
#page3 .tab0,#page3 .tab1,#page3 .tab2{
    width:510px;
}
#page3 .tab0{
	background:url(../img/tab_video1.png)0 0 ;
}
#page3 .tab1{
	background:url(../img/tab_video1.png)0 -30px ;
}
#page3 .tab2{
	background:url(../img/tab_video1.png)0 -60px ;
}
#page3 .list_video{
    width:1533px;
	margin-left:0px;
}
#page3 .list_video li{
    width:510px;
	height:335px;
}
#page3 .list_video span{
    top:120px;
	left:210px;
}
.videobg{
	position:absolute;
	top:0;
	left:0;
	z-index:0;
	width:100%;
	height:100%;
	background-size:cover;
	opacity:0.55;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0.55);
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0.55);
}
.video_player{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
/* 第四页 */
#page4{
    background:#1b1b1b;
	z-index:1;
}
.four_txt{
	width:340px;
	height:193px;
	margin:-300px 0 0 -170px;
	text-align:center;
	transition:all 1s ease;
}
.content1 .four_txt{
    margin-top:-150px;
	opacity:0;
}
.t1{
    font-size:20px;
	line-height:30px;
	color:#fc3f3f;
}
.t3{
    margin-top:5px;
	font-size:18px;
	line-height:28px;
	color:#000;
	background:#fc3f3f;
}
.manlist{
    width:1070px;
	height:4040px;
	margin:-50px 0 0 -540px;
	transition:all 1s ease;
	z-index:2;
}
.content1 .manlist{
    margin-top:-150px;
	opacity:0;
}
.manlist li{
    position:absolute;
	width:223px;
	height:223px;
	text-align:center;
	color:#fff;
	letter-spacing:1px;
	cursor:pointer;
	overflow:hidden;
	
}
.man_li1{
    top:0;
	left:0;
	background:url(../img/man1.png);
}
.man_li2{
    top:113px;
	left:113px;
	background:url(../img/man2.png);
}
.man_li3{
    top:0;
	left:225px;
	background:url(../img/man3.png);
}
.man_li4{
    top:130px;
	left:320px;
	background:url(../img/man4.png);
}
.man_li5{
    top:17px;
	left:433px;
	background:url(../img/man5.png);
}
.man_li6{
    top:130px;
	left:546px;
	background:url(../img/man6.png);
}
.man_li7{
    top:17px;
	left:658px;
	background:url(../img/man7.png);
}
.man_li8{
    top:179px;
	left:723px;
	background:url(../img/man8.png);
}
.man_li9{
    top:66px;
	left:836px;
	background:url(../img/man9.png);
}
.hover_show{
    width:223px;
	height:223px;
	background:url(../img/manmask.png);
	opacity:0;
	transition:all 0.4s ease;
}
.hover_show span{
    width:126px;
}
.hover_show h2{
    padding:76px 0 5px;
}
.manlist li:hover .hover_show{
    opacity:1;
}
.tatter{
    width:994px;
	height:647px;
	margin:-270px 0 0 -470px;
	background:url(../img/tatter.png);
}
.content1 .tatter{
    opacity:0;
}
/* 第五页 */
#page5{
    background:#242424 url(../img/bg.png)center;
	background-size:cover;
}
#page5 .enter{
    color:#222;
	border:2px solid #222;
}
#page5 .arrow{
    background:url(../img/back_arrow.png)0 -72px no-repeat;
}
.houxuan{
    position:absolute;
	bottom:0;
	left:50%;
	width:647px;
	height:829px;
	margin:0 0 0 -630px;
	background:url(../img/houxuan.png);
	transform-style:preserve-3d;
	transition:all 0.8s ease;
}
.content1 .houxuan{
    margin-left:-900px;
	opacity:0;
}
.bgline{
    position:absolute;
	top:0;
	left:50%;
	width:755px;
	height:923px;
	margin:0 0 0 -40px;
	background:url(../img/bg_line.png);
}
#page5 .logo{
    width:259px;
	margin:0 0 0 -130px;
	transition:all 0.5s ease;
}
#page5 .txt1{
    width:414px;
	height:170px;
	margin:-310px 0 0 120px;
}
#page5.content1 .txt1{
    margin-left:220px;
	opacity:0;
}
#page5 .txt2{    
	width:298px;
	height:37px;
	margin:-135px 0 0 126px;
	font-size:18px;
	color:#000;
	text-align:center;
	letter-spacing:1px;
	background:#ffc03a;
	transition:all 0.8s ease;
}
#page5.content1 .txt2{
    margin-left:260px;
	opacity:0;
}
#page5 .txt3{
	width:296px;
	height:64px;
	margin:-70px 0 0 128px;
	background:url(../img/txt2.png);
	transition:all 1s ease;
}
#page5.content1 .txt3{
    margin-left:280px;
	opacity:0;
}
#page5 .mv{
	margin:20px 0 0 128px;
	transition:all 1.2s ease;
}
#page5.content1 .mv{
    margin-left:360px;
	opacity:0;
}
#page5 .mv img{
    width:420px;
	height:235px;
	border:3px solid #ffc03a;
	cursor:pointer;
}
/* 侧边选项栏 */
.side{
    position:fixed;
	z-index:10;
	top:50%;
	right:0;
	margin-top:-190px;
	width:123px;
	height:410px;
	background:rgba(0,0,0,0.4);
	border-radius:3px 0 0 3px; 
}
.side_top{
    height:308px;
}
.number{
    float:right;
	margin:20px 20px 0 0;
	padding:30px 0;
	background:url(../img/menu_line.png) right repeat-y;
}
.number li a{
    display:block;
	width:60px;
	height:22px;
	padding:8px 34px 8px 0;
	line-height:22px;
	text-align:right;
	font-size:14px;
	color:rgba(229,229,229,0.5);
}
.number li a:hover{
    color:#ffe032;
}
.number li.on a{
    color:#ffe032;
	background:url(../img/menu_on.png) right center no-repeat;
}
/* 键盘 */
.tips{
    width:109px;
	height:36px;
	padding:16px 0 0 13px;
}
.keycode,.mouse{
    display:inline-block;	
	height:36px;	
	background:url(../img/keyboard.png)no-repeat;
}
.keycode{
    width:68px;
	background-position:-1px 0;
}
.mouse{
    width:26px;
	background-position:-72px 0;
}
.txt{
    padding:15px 0  0 13px;
	color:#ffe032;
	font-size:14px;
}